<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>管理平台</title>
    <link rel="stylesheet" href="assets/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="css/font/iconfont.css" media="all">
    <link rel="stylesheet" href="assets/font-awesome-4.7.0/css/font-awesome.css" media="all">
    <style type="text/css">
        html,body{
            margin: 0;
            padding: 0;
            width:100%;
            height: 100%;
            /*color:rgb(0,228,253);*/
            color:#00E4FD;
            /*overflow: hidden;*/
        }
        .top {
            position: relative;
            top: 0;
            left: 0;
            right: 0;
            height: 60px;
            background-image: linear-gradient(#030B1E, #031E33);
        }
        .title {
            position: absolute;
            left:0;
            top:0;
            width:418px;
            background: url(images/tb.png);
            background-size: 100% 100%;
            height: 60px;
            color:rgb(201,250,255);
            font-family: "微软雅黑";
            font-size: 18px;
            line-height: 50px;
            padding-left: 20px;
            z-index: 666;
        }
        .bg{
            position: absolute;
            left: 418px;;
            top:0;
            width:253px;
            height: 60px;
            background: url(images/tb1.png);
            background-size: 100% 100%;
            z-index: 666;
        }

        .divIcon{
            color:rgb(10,247,247);
            position: absolute;
            right: 20px;
            top:0;
        }
        .divIcon>a{
            float:right;
            line-height: 60px;
            cursor: pointer;
            color:rgb(10,247,247);
        }
        .divIcon1{

        }

        .divMenu {
            position: absolute;
            top: 60px;
            bottom: 0px;
            right: -250px;
            width: 240px;
            z-index: 999;
            background-image: linear-gradient(#062335, #030B1E);
            border-left: 1px solid #03374D;
            box-shadow: -1px 0px 10px #03374D;
            color:#00E4FD;
            overflow-y: auto;
        }

        .menuTitle{
            padding:0 20px;
            line-height: 50px;
            cursor: pointer;
        }
        .menuTitle:hover{
            color:#fff;
        }

        .menuUl {
            padding: 5px 0;
            line-height: 40px;
            background: rgb(3, 14, 33);
            display: none;
        }
        .menuUl>li{
            padding-left: 45px;
            padding-right: 10px;
            cursor: pointer;
        }
        .menuUl>li:hover{
            background: #062335;
            color:#fff;
        }
        .companyTitle{
            position: absolute;
            left:700px;
            top:0;
            /*width:400px;*/
            background-size: 100% 100%;
            height: 60px;
            color:rgb(201,250,255);
            font-family: "微软雅黑";
            font-size: 18px;
            line-height: 50px;
            padding-left: 20px;
            z-index: 666;
        }
        #scrollobj{
            white-space:nowrap;
            overflow:hidden;
            /*background-color:#CCC;*/
        }
    </style>
</head>
<body>
<div style="position: relative;width:100%;height: 100%;overflow: hidden">
    <div class="top">
        <div class="title" id="divTitle">
            <!--自然资源和规划建设局公园城市房管数据管理平台-->
        </div>
        <div class="bg"></div>
        <div id="scrollobj" class="companyTitle"></div>
        <div class="divIcon divIcon1">
            <a id="menuBtn" class="iconfont" title="目录打开/关闭" style="font-size: 20px;margin-left:10px;cursor: pointer">&#xe60b;</a>
            <a id="homeBtn" class="iconfont" title="首页" style="font-size: 20px;margin-left:10px;cursor: pointer">&#xe61e;</a>
            <a class="iconfont" style="margin-left:10px;font-size: 14px;vertical-align:middle;cursor: pointer" title="修改密码" id="txtUser" href="modifyPassword"></a>
            <a class="iconfont" title="登出" style="font-size: 26px;margin-left:10px;cursor: pointer;display: inline-block" href="login">&#xe65f;</a>
            <!--<span id="time" style="margin-left: 5px;line-height: 55px; "></span>-->
            <a id="date"></a>
            <div style="clear:both"></div>
        </div>
    </div>

    <div id="divMenu" class="divMenu">
        <i id="menuClose" class="layui-icon layui-icon-triangle-r" style="position: absolute;left:-4px;top:0px;z-index: 999;cursor: pointer"></i>
        <div id="load" style="position: absolute;left:0px; top:0px;width:5px;height: 50px;background: #00a65a;display: none"></div>
        <div id="menuCon" class="menuCon">
            <!--<div class="menuBox">-->
                <!--<div class="menuTitle">-->
                    <!--<div style="float:left;">-->
                        <!--<i class="layui-icon layui-icon-home"></i>-->
                        <!--<span style="margin-left:5px;">首页</span>-->
                    <!--</div>-->
                    <!--<div style="float:right;">-->
                        <!--<i class="layui-icon layui-icon-triangle-d"></i>-->
                    <!--</div>-->
                    <!--<div style="clear:both;"></div>-->
                <!--</div>-->
                <!--<ul class="menuUl">-->
                    <!--<li>菜单1菜单1菜单1菜单1菜单1菜单1菜单1菜单1菜单1</li>-->
                    <!--<li>菜单1</li>-->
                    <!--<li>菜单1</li>-->
                    <!--<li>菜单1</li>-->
                <!--</ul>-->
            <!--</div>-->
        </div>
    </div>

    <div id="divIfarme" style="position: absolute;top:60px;left:0;right:0;bottom:0;">
        <iframe id="iframe" src="" style="border-width:0px;width:100%;height:100%;"></iframe>
    </div>
</div>
</body>
<script src="assets/layui/layui.js"></script>
<script src="js/common.js"></script>
<script>
    layui.config({
        base: 'js/'
    })
    var $;
    var menuBl=true;//默认是否打开菜单
    var userType=0;
    layui.use(['jquery','form','validate','common'], function () {
        var form = layui.form,
                layer = layui.layer,
                validate = layui.validate,
                common = layui.common;
        $ = layui.jquery;

        getTime();
        setInterval(function () {
            getTime();
        }, 1000)

        function getTime() {
            var date = new Date().Format("dd/MM/yyyy");
            var time = new Date().Format("HH:mm:ss");
//            var html1=getNum(date,12);
            var html2 = getNum(time, 16);
            $("#time").html(date);
            $("#date").html(html2);
        }

        //菜单事件
        $('#menuBtn').click(function () {
            if (menuBl == false) {
                openMenu();
            } else {
                closeMenu();
            }
        })
        //关闭菜单
        $("#menuClose").click(function () {
            closeMenu();
        })

        init();

    })

    function init() {
        $("#scrollobj").width(window.innerWidth-1050);
        getUser();
        getSysName();
    }
    
    function getUser() {
        $.ajax({
            type: 'GET',
            url: 'sys/user/getUser',
            dataType: 'json',
            success: function (rtn) {
                if (rtn.code == 0 && rtn.data) {
                    $("#txtUser").html(rtn.data.userName);
                    userType = rtn.data.userType;
                    if(rtn.data.userId=='admin'){
                        userType=rtn.data.userId;
                    }
                    getResTreeByUser();
                    if (rtn.data.userType == 1) {
                        menuBl=false;
                        getCompanyName();
                        scrollRun();
                    }
                    if (rtn.data.userType == 2) {
                        getCompanyName();
                        scrollRun();
                    }
                    if (menuBl == true) {
                        openMenu();
                    }
                    // if (rtn.data.userType == 1) {
                    //     companyUser();
                    // } else {
                    //     getResTreeByUser();
                    //     if (menuBl == true) {
                    //         openMenu();
                    //     }
                    // }
                }
            },
            error: function () {

            }
        });
    }
    
    function companyUser() {
        $('#menuBtn').hide();
        var url="project/projectCompList.html"
        $('#iframe').attr("src", url);
        $('#homeBtn').click(function () {
            $('#iframe').attr("src", url);
        })
    }
    
    function getSysName() {
        $.ajax({
            type: 'GET',
            url: 'sys/common/sysName',
            dataType: 'text',
            success: function(rtn) {
               $('#divTitle').html(rtn)

            },
            error: function() {

            }
        });
    }
    function  getCompanyName() {
        $.ajax({
            url: "project/pro_com_name",
            dataType: "json",
            success: function (rtn) {
                if(rtn!=null&&rtn.data!=null){
                    var comName="欢迎"+rtn.data.split('_')[0]+"登录系统！"
                    comName+="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";
                    comName+="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";
                    comName+="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";
                    // $("#companyName").css("marginRight",500-comName.length);
                    $("#scrollobj").html(comName);
                }
            }
        });
    }
    function getResTreeByUser() {
        $.ajax({
            type: 'GET',
            url: 'sys/res/getResTreeByUser?span='+new Date().Format("yyyyMMddHHmmss"),
            dataType: 'json',
            success: function (rtn) {
                var html = '';
                var url='';
                $.each(rtn.children, function (i, r1) {
                    html += '<div class="menuBox">';
                    html += '<div class="menuTitle">';
                    html += '<div style="float:left;">';
                    html += '<i class="' + r1.icon + '"></i>';
                    html += '<span style="margin-left:5px;">' + r1.name + '</span>';
                    html += '</div>';
                    html += '<div style="float:right;">';
                    html += '<i class="layui-icon layui-icon-triangle-d"></i>';
                    html += '</div>';
                    html += '<div style="clear:both;"></div>';
                    html += '</div>';
                    html += '<ul class="menuUl">';
                    $.each(r1.children, function (j, r2) {
                        if(i==0 && j==0) {
                            if (r2.url.indexOf("?") > -1) {
                                url = r2.url + "&resId=" + r2.id;
                            } else {
                                url = r2.url + "?resId=" + r2.id;
                            }
                            url+="&userType="+userType;
                        }
                        html += '<li onclick="openFrame(\''+r2.id+'\',\''+r2.url+'\')">'+r2.name+'</li>';
                    })
                    html += '</ul>';
                    html += '</div>';
                })
                $('#menuCon').html(html);
                menuEvent();
                if(url!="") {
                    $('#iframe').attr("src", url);
                }
                $('#homeBtn').click(function () {
                    $('#iframe').attr("src", url);
                })
            },
            error: function () {

            }
        });
    }

    function menuEvent() {
        //菜单事件
        $.each($("#menuCon").find(".menuTitle"), function (i, t) {
            $(t).hover(function () {
                var top = $(t).offset().top - 60 + $("#divMenu").scrollTop();
                $("#load").height(50)
                $("#load").animate({top: top + "px"}, 50);
                $("#load").show()
            }, function () {
                $("#load").hide()
            })

            $(t).click(function () {
                if($(t).next("ul").length==1) {
                    $(t).next("ul").slideToggle(150);
                }
            })

        })
        //菜单事件
        $.each($("#menuCon").find("li"),function (i, t) {
            $(t).hover(function () {
                var top = $(t).offset().top - 60 + $("#divMenu").scrollTop();
                $("#load").height(40)
                $("#load").animate({top: top + "px"}, 50);
                $("#load").show()
            }, function () {
                $("#load").hide()
            })
        })
    }

    function openFrame(id,url) {
        if (url.indexOf("?") > -1) {
            url = url + "&resId=" + id;
        } else {
            url = url + "?resId=" + id;
        }
        url+="&userType="+userType;
        $("#iframe").attr("src", url)
    }
    
    
    //打开菜单
    function openMenu() {
        menuBl = true;
        $('#divIfarme').animate({right:250});
        $('#divMenu').animate({right:0})
    }

    //关闭菜单
    function closeMenu() {
        menuBl = false;
        $('#divIfarme').animate({right:0});
        $('#divMenu').animate({right:-250})
    }

    //首页点击
    function homeCk() {
        $("#iframe").attr("src", "home.html");
    }


    
    //数字转换
    function getNum(str,font){
        var str = String(str);
        var arr=str.split('');
        var num='';
        for(var i=0;i<arr.length;i++) {
            switch (arr[i]) {
                case '1':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe697;</i>';
                    break;
                case '2':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe698;</i>';
                    break;
                case '3':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe699;</i>';
                    break;
                case '4':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe69a;</i>';
                    break;
                case '5':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe69b;</i>';
                    break;
                case '6':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe69c;</i>';
                    break;
                case '7':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe69d;</i>';
                    break;
                case '8':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe69e;</i>';
                    break;
                case '9':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe69f;</i>';
                    break;
                case '0':
                    num += '<i class="iconfont" style="font-size: ' + font + 'px">&#xe696;</i>';
                    break;
                default:
                    num += arr[i];
                    break;
            }
        }
        return num;
    }

    function scrollRun(){
        var _timer=setInterval("scroll(scrollobj)",50);
        scrollobj.onmouseover=_stop;
        scrollobj.onmouseout=_start;

        function _stop(){
            if(_timer!= null){
                clearInterval(_timer);
            }
        }
        function _start() {
            _timer=setInterval("scroll(document.getElementById('scrollobj'))",50);
        }
    }

    function scroll(obj){
        var tmp=(obj.scrollLeft)++;
        if(obj.scrollLeft==tmp) {
            obj.innerHTML+=obj.innerHTML;
        }
        if(obj.firstChild!=null&&obj.scrollLeft>=obj.firstChild.offsetWidth) {
            obj.scrollLeft=0;
        }
    }
</script>
</html>